<!DOCTYPE>
<html>
	<head>
		<meta charset="UTF-8">
		<title>修改密码</title>
	</head>
	<script type="text/javascript" src="js/jquery-3.2.1.min.js"></script>
    <meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=0">
    <meta content="telephone=no" name="format-detection" />
    <meta name="apple-mobile-web-app-capable" content="yes" />
    <style>
    	
    body{
			    font-family: 'Helvetica Neue',Helvetica,sans-serif;
			    font-size: 17px;
			    line-height: 21px;
			    color: #000;
			    margin: 0px;
			    padding: 0px;
			    background-image: url(img/ba.jpg);
			}
			
		div.showtitle{
			width:100%;
			height: 40px;
			background: chartreuse;
		}
		
		div.showtitle span{
			line-height: 40px;
			text-align: center;
		    font-size: 30px;
		}
		
		.col-sm-6{
			float: left;
			width: 200px;
		}
		
		.fa-plus-circle{
			position: absolute;
			top: 0px;
			right: 0px;
		}
		
		 .nav-footer {
				    width: 100%;
				    position: fixed;
				    bottom: 0;
				    left: 0;
				    display: flex;
				    align-items: center;
				    justify-content: space-around;
				    background: #fff;
				    border-top: solid 1px #e6e6e6;
				    padding: 1%;
				    height: 50px;
				}
				.nav-footer a {
				    display: flex;
				    flex-direction: column;
				    align-content: center;
				    align-items: center;
				    font-size: 10px;
				    color: #929292;
				}
				.nav-footer a span img {
				    height: 25px;
				    overflow: hidden;
				    font-size: 23px;
				    padding-top: 2px;
				}
				.mui-icon {
				    font-family: Muiicons;
				    font-size: 24px;
				    font-weight: 400;
				    font-style: normal;
				    line-height: 1;
				    display: inline-block;
				    text-decoration: none;
				    -webkit-font-smoothing: antialiased;
				}
				.nav-footer a {
				    display: flex;
				    flex-direction: column;
				    align-content: center;
				    align-items: center;
				    font-size: 11px;
				    color: #929292;
				}
				
				.mui-bar-nav {
				    top: 0;
				    -webkit-box-shadow: 0 1px 6px #ccc;
				    box-shadow: 0 1px 6px #ccc;
				}
				
				.mui-bar {
				    position: fixed;
				    z-index: 10;
				    right: 0;
				    left: 0;
				    height: 44px;
				    padding-right: 10px;
				    padding-left: 10px;
				    border-bottom: 0;
				    background-color:RGB(88,88,88);
				}
				
				.mui-bar-nav.mui-bar .mui-icon {
				    /*margin-right: -10px;*/
				    margin-left: -10px;
				    padding-right: 10px;
				    padding-left: 10px;
				}
				.mui-bar .mui-icon {
				    font-size: 24px;
				    position: relative;
				    z-index: 20;
				    padding-top: 10px;
				    padding-bottom: 10px;
				}
				.mui-icon {
				    font-family: Muiicons;
				    font-size: 24px;
				    font-weight: 400;
				    font-style: normal;
				    line-height: 1;
				    display: inline-block;
				    text-decoration: none;
				    -webkit-font-smoothing: antialiased;
				}
				.mui-pull-left {
				    float: left;
				}
				a {
				    text-decoration: none;
				    color: #FC605A;
				}
				a {
				    background: 0 0;
				}
				
				.mui-bar .mui-title {
				    right: 201px;
				    left: 40px;
				    top: 4px;
				    display: inline-block;
				    overflow: hidden;
				    width: auto;
				    margin: 0;
				    text-overflow: ellipsis;
				}
				.mui-title {
				    font-size: 17px;
				    font-weight: 500;
				    line-height: 44px;
				    position: absolute;
				    display: block;
				    width: 100%;
				    margin: 0 -10px;
				    padding: 0;
				    text-align: center;
				    white-space: nowrap;
				    color: #fff;
				}
				
				.mine-photo{
			    	width: 100%;
				    background-image: url(img/curry.jpg);
				    height: 18rem;
				    background-repeat: no-repeat;
				    text-align: center;
				    position: relative;
				    color: #fff;
				    width: 320px;
				    height: 320px;
			    }
                .pass1{
                	position: absolute;
                	top: 11%;
                	right: 23%;
                	width: 63%;
                	height: 7%;
                	border-radius: 20px;
                }
                
                .pass2{
                	position: absolute;
                	top: 20%;
                	right: 23%;
                	width: 63%;
                	height: 7%;
                	border-radius: 20px;
                }
                .submit{
                	position: absolute;
                	top: 34%;
                	right: 2%;
                	width: 22%;
                	height: 6%;
                	border-radius: 20px;
                	background-color: #E39149;
                	color:#FFFAFA ;
                	border-color: #F8A41B;
                }
    </style>
	<body>	
		<header class="mui-bar mui-bar-nav">
			<a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"><img src="img/left_fri.png"/></a>
			<h1 class="mui-title">修改密码</h1>
		</header>
	       <input type="password" class="pass1" placeholder="Password" id="password"/>	      
	       <input type="password" class="pass2" placeholder="RefPassword" id="password1"/>	
	       <input type="button" id="submit" class="login__submit submit" value="修改" onclick="ChangePassword()">
	</body>
	
	
	<script type="text/javascript">
		  function ChangePassword(){
	var id=window.localStorage.getItem('userid');
	var newPass=document.getElementById('password1').value;
	var url="http://172.24.10.175/workout/api.php/updatepass/userid/"+id+"/password/"+newPass;	
	alert(url);
            $.ajax({
                type: 'post',
                url: url,
                dataType: 'jsonp',
				jsonp: "callback",
                success: function (data){  
                	alert(1);
                window.location.href="login.html"; 
                },error:function(){
                	alert("修改成功！");
                window.location.href="login.html"; 
                }
            });
        }
	</script>
</html>
